<template>
    <div class="map">
        <iframe id="mapPage" width="100%" height="100%" frameborder=0 :src="iframeSrc"></iframe>
    </div>
</template>

<script>
export default {
    name: 'QqMap',
    data() {
        return {
            iframeSrc:'/locationPicker.html?search=1&type=1&key=7OJBZ-HBKK3-URG3R-34DI5-HH7XS-L5BFL&referer=myapp',

        }
    },
    mounted(){
        this.initMap();
    },
    methods:{
        initMap(){
            let self = this;
            window.addEventListener('message', function(event) {
                // 接收位置信息，用户选择确认位置点后选点组件会触发该事件，回传用户的位置信息
                let loc = event.data
                if (loc.poiname === '我的位置' || loc.poiaddress === '') {
                    self.$toast('无法识别该地址，请移动地图重新选择')
                    return false
                }
                if (loc && loc.module === 'locationPicker') { // 防止其他应用也会向该页面post信息，需判断module是否为'locationPicker'
                    self.$emit('callback', loc)
                }
            }, false)
        },
    }
}
</script>